<template>
    <div class="page">
        <div class="scorll">
            <div class="map">
                <div id="container" class="container" v-show="mapFlag"></div>
                <div class="header clearfix">
                    <div class="listTab">
                        <Tabs v-model="tabActiveName" @on-click="setTabClick">
                            <TabPane :label="`全部（${allNum > 99 ? '99+' : allNum}）`" name="first"></TabPane>
                            <TabPane :label="`我上报的（${reportNum > 99 ? '99+' : reportNum}）`" name="second"></TabPane>
                            <TabPane :label="`需要处理的（${disposeNum > 99 ? '99+' : disposeNum}）`" name="third"></TabPane>
                        </Tabs>
                        <div class="right" @click.prevent="switchListBtn">
                            <span class="el-icon-sort" style="color:#1891FF;"></span>
                            <span v-if="!mapFlag">切换地图</span>
                            <span v-if="mapFlag">切换列表</span>
                        </div>
                    </div>
                    <div class="list">
                        <div class="item daterange">
                            <span>选择日期:</span>
                            <DatePicker
                                :editable="false"
                                type="daterange"
                                transfer
                                :clearable="false"
                                v-model="dateArr"
                                v-if="inputShow"
                                format="yyyy-MM-dd"
                                placement="top-start"
                                show-week-numbers
                                placeholder="请选择日期"
                                style="width: 250px;left:0;top:0;"
                                @on-change="getDateArr"
                            ></DatePicker>
                            <DatePicker
                                type="daterange"
                                format="yyyy-MM-dd"
                                placement="top"
                                show-week-numbers
                                placeholder="请选择日期"
                                v-if="inputShow"
                                style="opacity:0;position: absolute;top:-9999px;width:1px;"
                            ></DatePicker>
                        </div>
                        <div class="item">
                            <span>超时状态 :</span>
                            <Select v-model="timeoutMode" clearable style="width:250px;" placeholder="请选择" @on-change="getTimeoutMode">
                                <Option v-for="(item, index) in timeoutModeList" :value="item.id" :key="index" >{{ item.name }}</Option>
                            </Select>
                        </div>
                        <div class="item">
                            <span>紧急程度:</span>
                            <Select v-model="urgency" clearable style="width:250px;" placeholder="请选择" @on-change="getUrgency">
                                <Option v-for="(item, index) in urgencyList" :value="item.id" :key="index" >{{ item.name }}</Option>
                            </Select>
                        </div>
                    </div>
                    <div class="list">
                        <div class="item">
                            <span>问题状态:</span>
                            <Select v-model="issueStatus" clearable style="width:250px;" placeholder="请选择" @on-change="getIssueStatus" transfer>
                                <Option v-for="(item, index) in issueStatusList" :value="item.id" :key="index" >{{ item.name }}</Option>
                            </Select>
                        </div>
                        <div class="item">
                            <span>检查部位:</span>
                            <treeselect
                                v-if="inputShow"
                                :options="datalist"
                                placeholder="请选择"
                                @select="getCheckSelect"
                                style="width:250px;"
                                v-model="check"
                                z-index="999"
                                :appendToBody="true"
                                clearable
                                :normalizer="normalizer"
                            />
                            <treeselect
                                v-if="inputShow"
                                :options="datalist"
                                placeholder="请选择"
                                @select="getCheckSelect"
                                v-model="check"
                                style="opacity:0;position: absolute;top:-9999px;width:1px;"
                                :normalizer="normalizer"
                            />
                        </div>
                        <div class="item">
                            <el-button type="primary" @click.native.prevent="searchAll" size="small" plain >搜索</el-button>
                            <el-button type="info" @click.native.prevent="clear" style="margin-left:20px;margin-right: 20px" size="small" plain >重置</el-button>
                            <el-dropdown split-button size="small" @click="handleClick" v-if="!mapFlag">
                                数据导出
                                <el-dropdown-menu slot="dropdown">
                                    <el-dropdown-item @click.native="goEXP">导出记录</el-dropdown-item>
                                </el-dropdown-menu>
                            </el-dropdown>
                        </div>
                    </div>
                </div>
                <div class="tableList clearfix" v-show="!mapFlag">
                    <div class="addBtn">
                        <el-button v-if="auth.isReport" type="primary" @click.native.prevent="showModalBtn(0)" size="small" plain >问题上报</el-button>
                    </div>
                    <div class="table" style="width:100%;margin:20px auto;">
                        <el-table :data="tableList" style="width: 100%" @selection-change="handleSelectionChange">
                            <el-table-column type="selection" width="55"></el-table-column>
                            <el-table-column prop="partName" label="检查部位" width="250"></el-table-column>
                            <el-table-column prop="issueContent" label="问题明细" width="250"></el-table-column>
                            <el-table-column prop="checkUserName" label="检查人"></el-table-column>
                            <el-table-column prop="rectifyStartTime" label="检查时间"></el-table-column>
                            <el-table-column prop="state" label="问题状态" align="center">
                                <template slot-scope="scope">
                                    <span v-if="scope.row.state == 10" style="color:#FF4848;" >待整改</span>
                                    <span v-if="scope.row.state == 11" style="color:#A9B0BB;" >不合格</span>
                                    <span v-if="scope.row.state == 12" style="color:#A9B0BB;" >不合格</span>
                                    <span v-if="scope.row.state == 20" style="color:#FFA64D;" >待复查</span>
                                    <span v-if="scope.row.state == 30" style="color:#3755A7;" >待核验</span>
                                    <span v-if="scope.row.state == 100" style="color:#28D79C;" >已完成</span>
                                    <span v-if="scope.row.overdue == 1" style="padding:4px 2px;background:#1891FF;color:#fff;border-radius:8px;margin-right:10px;" >超</span>
                                </template>
                            </el-table-column>
                             <el-table-column prop="code" label="紧急程度" align="center">
                                <template slot-scope="scope">
                                    <span class="blue" v-if="scope.row.urgency == 1" >一般</span>
                                    <span class="red" v-if="scope.row.urgency == 2" >紧急</span>
                                </template>
                            </el-table-column>
                            <el-table-column fixed="right" label="操作" align="center">
                                <template slot-scope="scope">
                                    <el-button @click.native.prevent="toDetail(scope.row.checkId)" type="text" size="small">详情</el-button>
                                    <el-popconfirm title="确定要删除吗？" @confirm="remove(scope.row)">
                                        <el-button slot="reference" size="small" type="text" v-if="auth.isDelete" style="color:red;">删除</el-button>
                                    </el-popconfirm>
                                    <!-- <el-button @click.native.prevent="remove(scope.row)" v-if="auth.isDelete" type="text" size="small" style="color:red;" >删除</el-button> -->
                                </template>
                            </el-table-column>
                        </el-table>
                    </div>
                    <div class="clearfix" v-show="tableList.length > 0">
                        <div class="float-right">
                            <Page
                                v-if="totalCount"
                                style="margin: 20px 0;text-align: center;"
                                :current.sync="current"
                                :total="totalCount"
                                :page-size="pageSize"
                                show-elevator
                                show-sizer
                                show-total
                                @on-change="pageChange"
                                @on-page-size-change="pageSizeChange"
                            ></Page>
                        </div>
                    </div>
                </div>
                <div class="footer" @click.prevent="showModalBtn(0)" v-show="mapFlag && auth.isReport">
                    <img src="../../assets/images/safety/record/report_icon.png" />
                </div>
            </div>
        </div>

        <Modal v-model="reportModal" title="问题上报" width="900px;" :mask-closable="false" @on-visible-change="visibleChangeFn">
            <div class="modal">
                <div class="list">
                    <h2>问题信息</h2>
                    <div class="item">
                        <span class="tip" style="color:red;top:8px">*</span>
                        <div class="left">
                            <span>检查地点 ：</span>
                            <Input v-model="submitData.ads" disabled style="width: 530px" clearable/>
                            <Input v-show="inputShow" placeholder="请输入关键字" style="opacity:0;position: absolute;top:-9999px;width:1px;" clearable/>
                        </div>
                        <div class="right">
                            <el-button @click.native.prevent="getGPS" type="primary" size="small" plain >请选择检查地址</el-button>
                        </div>
                    </div>
                    <div class="item switch">
                        <div class="top">
                            <div class="readio">
                                <span class="tip" style="color:red;margin-right:6px">*</span>
                                <span>检查部位 ：</span>
                                <RadioGroup v-model="switchCheckName" @on-change="switchCheckNameFn">
                                    <Radio label="选择录入"></Radio>
                                    <Radio label="手动录入"></Radio>
                                </RadioGroup>
                            </div>
                            <div class="readio" style="margin-left:55px;">
                                <span class="tip" style="color:red;margin-right:6px">*</span>
                                <span>问题明细 ：</span>
                                <RadioGroup v-model="switchClassName" @on-change="switchClassNameFn" filterable>
                                    <Radio label="选择录入"></Radio>
                                    <Radio label="手动录入"></Radio>
                                </RadioGroup>
                            </div>
                        </div>
                        <div class="bottom">
                            <div class="left">
                                <treeselect
                                    v-show="switchCheckName == '选择录入'"
                                    :options="datalist"
                                    placeholder="请选择"
                                    @select="getReportCheckSelect"
                                    style="width:300px;margin-left:70px;margin-top:10px;"
                                    v-model="submitData.checkTree"
                                    :normalizer="normalizer"
                                />
                                <Input
                                    :maxlength="30"
                                    v-show="switchCheckName == '手动录入'"
                                    placeholder="请输入"
                                    v-model="submitData.partName"
                                    style="width: 300px;height:36px;margin-left:70px;margin-top:10px;"
                                    clearable
                                />
                            </div>

                            <div class="rigth">
                                <treeselect
                                    v-show="switchClassName == '选择录入'"
                                    :options="issuelist"
                                    placeholder="请选择"
                                    @select="getIssueClassSelect"
                                    style="width:300px;height:36px;margin-top:10px;"
                                    v-model="submitData.issueTree"
                                    :normalizer="normalizer"
                                />
                                <Input
                                    :maxlength="50"
                                    v-show="switchClassName == '手动录入'"
                                    placeholder="请输入"
                                    v-model="submitData.issueContent"
                                    style="width: 300px;height:36px;margin-top:10px;"
                                    clearable
                                />
                            </div>
                        </div>
                    </div>
                    <div class="item ">
                        <div class="readio">
                            <span class="tip" style="color:red;">*</span>
                            <span>紧急程度 ：</span>
                            <RadioGroup v-model="submitData.generalRadio">
                                <Radio label="一般"></Radio>
                                <Radio label="紧急"></Radio>
                            </RadioGroup>
                        </div>
                    </div>
                    <div class="item">
                        <span class="tip" style="color:red;">*</span>
                        <span style="white-space: nowrap;">检查说明 ：</span>
                        <el-input
                            maxlength="200"
                            show-word-limit
                            placeholder="请输入"
                            type="textarea"
                            style="width: 710px"
                            v-model="submitData.checkText"
                        ></el-input>
                    </div>
                    <div class="item img">
                        <span style="margin-right:5px;white-space:nowrap;">现场图片 ：</span>
                        <div class="imgBox">
                            <el-upload
                                :class="{ hideAdd: imgFlag }"
                                ref="uploadImg"
                                :headers="headers"
                                :action="$axios.defaults.baseURL + '/ms/api/safety/check/uploadImg'"
                                list-type="picture-card"
                                accept="image/png, image/jpg, image/jpeg"
                                :before-upload="beforeIMgUpload"
                                :on-success="reportlogImgSuccess"
                                name="file"
                                :limit="10"
                                :on-exceed="exceedImg"
                                :on-remove="handleReportRemove"
                            >
                                <i class="el-icon-plus"></i>
                            </el-upload>
                        </div>
                    </div>
                </div>
                <div class="list">
                    <h2>整改要求</h2>
                    <div class="item">
                        <div class="left">
                            <span class="tip" style="color:red;">*</span>
                            <span>整改人 ：</span>
                            <Select v-model="submitData.operator" style="width:300px;" placeholder="请选择" @on-change="getOperator" filterable multiple>
                                <Option v-for="(item, index) in operatorList" :value="item.id" :key="index" >{{ item.nickname }}</Option>
                            </Select>
                        </div>
                        <div class="right">
                            <span class="tip" style="color:red;">*</span>
                            <span style="margin-right:10px;">整改期限 ：</span>
                            <DatePicker
                                type="date"
                                :clearable="false"
                                v-if="inputShow"
                                format="yyyy-MM-dd"
                                :options="options"
                                @on-change="getReportDate"
                                v-model="submitData.timeLimit"
                                placeholder="请输入"
                                style="width: 280px;"
                            ></DatePicker>
                            <DatePicker
                                type="date"
                                v-if="inputShow"
                                format="yyyy-MM-dd"
                                style="opacity:0;position: absolute;top:-9999px;width:1px;"
                            ></DatePicker>
                        </div>
                    </div>
                    <div class="item">
                        <div class="left item_com">
                            <span class="tip" style="color:red;">*</span>
                            <span>整改要求 ：</span>
                            <div class="textBox">
                                <el-input
                                    maxlength="200"
                                    show-word-limit
                                    placeholder="请输入"
                                    type="textarea"
                                    v-model="submitData.require"
                                ></el-input>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="list rec_com">
                    <h2>复查信息</h2>
                    <div class="item">
                        <div class="left">
                            <span class="tip" style="color:red;">*</span>
                            <span style="margin-right:10px;">复查人 ：</span>
                            <Select
                                v-model="submitData.reviewPeople"
                                style="width:705px;"
                                placeholder="请选择"
                                @on-change="getReviewPeople"
                                filterable
                                multiple
                            >
                                <Option
                                    v-for="(item, index) in reviewPeopleList"
                                    :value="item.id"
                                    :key="index"
                                    >{{ item.nickname }}</Option
                                >
                            </Select>
                        </div>
                    </div>
                </div>
                <div class="list rec_com">
                    <h2>核验信息</h2>
                    <div class="item">
                        <div class="left">
                            <span style="margin-right:10px;">核验人 ：</span>
                            <Select
                                v-model="submitData.checkPeople"
                                style="width:705px;"
                                placeholder="请选择"
                                @on-change="getCheckPeople"
                                filterable
                                multiple
                            >
                                <Option
                                    v-for="(item, index) in checkPeopleList"
                                    :value="item.id"
                                    :key="index"
                                    >{{ item.nickname }}</Option
                                >
                            </Select>
                        </div>
                    </div>
                </div>
                <div class="list rec_com">
                    <h2>抄送信息</h2>
                    <div class="item">
                        <div class="left">
                            <span style="margin-right:10px;">抄送人 ：</span>
                            <Select
                                v-show="inputShow"
                                v-model="submitData.sendPeople"
                                style="width:705px;"
                                placeholder="请选择"
                                @on-change="getSendPeople"
                                filterable
                                multiple
                            >
                                <Option
                                    v-for="(item, index) in sendPeopleList"
                                    :value="item.id"
                                    :key="index"
                                    >{{ item.nickname }}</Option
                                >
                            </Select>
                            <Select
                                v-model="submitData.sendPeople"
                                placeholder="请选择"
                                @on-change="getSendPeople"
                                filterable
                                multiple
                                v-show="inputShow"
                                style="opacity:0;position: absolute;top:-9999px;width:1px;"
                            >
                                <Option
                                    v-for="(item, index) in sendPeopleList"
                                    :value="item.id"
                                    :key="index"
                                    >{{ item.nickname }}</Option
                                >
                            </Select>
                        </div>
                    </div>
                </div>
            </div>
            <div slot="footer">
                <el-button
                    @click.native.prevent="cancel(2)"
                    type="info"
                    size="small"
                    plain
                    >取消</el-button
                >
                <el-button
                    @click.native.prevent="submitBtn"
                    type="primary"
                    size="small"
                    plain
                    v-preventReClick="1500"
                    >提交</el-button
                >
            </div>
        </Modal>

        <Modal v-model="detailsModal" title="问题详情" width="900px;" :mask-closable="false">
            <div slot="header">
                <span style="font-size: 16px">问题详情</span>
                <el-button size="small" style="margin-left: 20px" @click="handleClick" >导出</el-button>
            </div>
            <div class="detailsModal">
                <div class="list">
                    <div class="box" v-if="operationState != 100">
                        <el-steps :active="Number(operationState)" process-status="wait" style="margin:auto;">
                            <el-step :title="item.name" v-for="(item, i) in userList" :key="i">
                                <div slot="description">{{ item.userNames }}</div>
                                <div slot="description" v-if="item.opResult != 2">{{ item.time }}</div>
                            </el-step>
                        </el-steps>
                    </div>
                    <div class="box" v-if="operationState == 100">
                        <el-steps :active="Number(operationState)" process-status="wait" style="margin:auto;">
                            <el-step :title="item.name" v-for="(item, i) in userList" :key="i">
                                <div slot="description">{{ item.userNames }}</div>
                                <div slot="description">{{ item.time }}</div>
                            </el-step>
                        </el-steps>
                    </div>
                </div>
                <div class="list">
                    <h2>
                        <span>问题信息</span>
                        <span class="logBgc" v-if="detailsObj.urgency == 1">一般</span>
                        <span class="logBgc" style="background:#909399;" v-if="detailsObj.urgency == 2" >紧急</span>
                    </h2>
                    <div class="item">
                        <div class="left">
                            <span>检查人 ：</span>
                            <span>{{ detailsObj.userName }}</span>
                        </div>
                        <div class="right">
                            <span>检查部位 ：</span>
                            <span>{{ detailsObj.partName }}</span>
                        </div>
                    </div>
                    <div class="item">
                        <div class="left">
                            <span>检查时间 ：</span>
                            <span>{{ detailsObj.checkTime }}</span>
                        </div>
                        <div class="right">
                            <span>检查地点 ：</span>
                            <div class="rightText" style="max-width:400px">
                                <Tooltip
                                    transfer
                                    :content="detailsObj.address ? detailsObj.address : ''"
                                    placement="top-start"
                                    max-width="250"
                                >
                                    <p style="width:250px;overflow: hidden;text-overflow:ellipsis;white-space:nowrap;cursor: pointer;">
                                        {{detailsObj.address ? detailsObj.address : ""}}
                                    </p>
                                </Tooltip>
                            </div>
                        </div>
                    </div>
                    <div class="item">
                        <div class="left">
                            <span>问题类别 ：</span>
                            <span>{{ detailsObj.issueTypeName }}</span>
                        </div>
                        <div class="right">
                            <span>问题明细 ：</span>
                            <div class="rightText" style="max-width:400px">
                                <Tooltip
                                    transfer
                                    :content="detailsObj.issueContent ? detailsObj.issueContent : ''"
                                    placement="top-start"
                                    max-width="250"
                                >
                                    <p style="width:250px;overflow: hidden;text-overflow:ellipsis;white-space:nowrap;cursor: pointer;">
                                        {{detailsObj.issueContent ? detailsObj.issueContent : ""}}
                                    </p>
                                </Tooltip>
                            </div>
                        </div>
                    </div>
                    <div class="item">
                        <div class="textBox">
                            <span style="white-space:nowrap;width:90px">检查说明 ：</span>
                            <div class="rightText" style="max-width:600px">
                                <Tooltip
                                    transfer
                                    :content="
                                        detailsObj.checkDesc
                                            ? detailsObj.checkDesc
                                            : ''
                                    "
                                    placement="top-start"
                                    max-width="600"
                                    style="word-wrap:break-word;"
                                >
                                    <p
                                        style="width:600px;overflow: hidden;text-overflow:ellipsis;white-space:nowrap;cursor: pointer;"
                                    >
                                        {{
                                            detailsObj.checkDesc
                                                ? detailsObj.checkDesc
                                                : ""
                                        }}
                                    </p>
                                </Tooltip>
                            </div>
                        </div>
                    </div>
                    <div class="item">
                        <div class="right ">
                            <span style="white-space:nowrap;width:90px"
                                >现场图片 ：</span
                            >
                            <div
                                class="img"
                                v-if="
                                    detailsObj.imgUrlList &&
                                        detailsObj.imgUrlList.length > 0
                                "
                            >
                                <el-image
                                    style=" width: 77px;height: 77px;margin-right: 50px; margin-bottom: 10px;"
                                    :src="item"
                                    alt=""
                                    v-for="(item, i) in detailsObj.imgUrlList"
                                    :key="i"
                                    :preview-src-list="detailsObj.imgUrlList"
                                ></el-image>
                            </div>
                            <div class="img" v-else>—</div>
                        </div>
                    </div>
                </div>
                <div class="list">
                    <h2>整改要求</h2>
                    <div class="item">
                        <div class="left">
                            <span>整改人 ：</span>
                            <span>{{ operatorObj }}</span>
                        </div>
                        <div class="right">
                            <span>整改期限 ：</span>
                            <span>{{ detailsObj.rectifyTime }}</span>
                        </div>
                    </div>
                    <div class="item">
                        <div class="textBox">
                            <span style="white-space:nowrap;width:90px">整改要求 ：</span>
                            <div class="rightText" style="max-width:600px">
                                <Tooltip
                                    transfer
                                    :content="
                                        detailsObj.rectifyRequire
                                            ? detailsObj.rectifyRequire
                                            : ''
                                    "
                                    placement="top-start"
                                    max-width="600"
                                >
                                    <p
                                        style="width:600px;overflow: hidden;text-overflow:ellipsis;white-space:nowrap;cursor: pointer;"
                                    >
                                        {{
                                            detailsObj.rectifyRequire
                                                ? detailsObj.rectifyRequire
                                                : ""
                                        }}
                                    </p>
                                </Tooltip>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="list">
                    <h2>
                        <span>复查信息</span>
                    </h2>
                    <div class="item">
                        <div class="left">
                            <span>复查人 ：</span>
                            <span>{{ reviewPeopleObj }}</span>
                        </div>
                    </div>
                </div>
                <div class="list">
                    <h2>
                        <span>核验信息</span>
                    </h2>
                    <div class="item">
                        <div class="left">
                            <span>核验人 ：</span>
                            <span>{{ checkPeopleObj }}</span>
                        </div>
                    </div>
                </div>
                <div class="list">
                    <h2>其他信息</h2>
                    <div class="item">
                        <div class="left">
                            <span>抄送人 ：</span>
                            <span>{{ sendPeopleObj }}</span>
                        </div>
                    </div>
                </div>
                <template>
                    <div class="logBox" style="margin-top:20px;">
                        <div
                            class="list"
                            v-for="(item, i) in detailsObj.logList"
                            :key="i"
                        >
                            <h2>
                                <span v-if="item.opType == 2">整改结果</span>
                                <span v-if="item.opType == 3">复查结果</span>
                                <span v-if="item.opType == 4">核验结果</span>
                                <span
                                    class="logBgc"
                                    v-if="
                                        item.opType != 1 && item.opResult == 1
                                    "
                                    >合格</span
                                >
                                <span
                                    class="logBgc"
                                    v-if="
                                        item.opType != 1 && item.opResult == 2
                                    "
                                    >不合格</span
                                >
                            </h2>
                            <div class="item">
                                <div class="left">
                                    <span v-if="item.opType == 2">
                                        整改人 ：</span
                                    >
                                    <span v-if="item.opType == 3">
                                        复查人 ：</span
                                    >
                                    <span v-if="item.opType == 4">
                                        核验人 ：</span
                                    >
                                    <span>{{ item.userName }}</span>
                                </div>
                                <div class="right">
                                    <span v-if="item.opType == 2"
                                        >整改时间 ：</span
                                    >
                                    <span v-if="item.opType == 3"
                                        >复查时间 ：</span
                                    >
                                    <span v-if="item.opType == 4"
                                        >核验时间 ：</span
                                    >
                                    <span>{{ item.opTime }}</span>
                                </div>
                            </div>
                            <div class="item">
                                <div class="left">
                                    <div class="textBox">
                                        <span
                                            v-if="item.opType == 2"
                                            class="rightText"
                                        >
                                            整改说明 ：</span
                                        >
                                        <span v-if="item.opType == 3">
                                            复查说明 ：</span
                                        >
                                        <span v-if="item.opType == 4">
                                            核验说明 ：</span
                                        >
                                        <div
                                            class="rightText"
                                            style="max-width:400px"
                                        >
                                            <Tooltip
                                                transfer
                                                :content="
                                                    item.opDesc
                                                        ? item.opDesc
                                                        : ''
                                                "
                                                placement="top-start"
                                                max-width="400"
                                            >
                                                <p
                                                    style="width:400px;overflow: hidden;text-overflow:ellipsis;white-space:nowrap;cursor: pointer;"
                                                >
                                                    {{
                                                        item.opDesc
                                                            ? item.opDesc
                                                            : ""
                                                    }}
                                                </p>
                                            </Tooltip>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="item">
                                <div class="left imgbox">
                                    <span v-if="item.opType == 2">
                                        现场图片 ：</span
                                    >
                                    <span v-if="item.opType == 3">
                                        现场图片 ：</span
                                    >
                                    <span v-if="item.opType == 4">
                                        现场图片 ：</span
                                    >
                                    <div
                                        class="img"
                                        v-if="
                                            item.imgUrlList &&
                                                item.imgUrlList.length > 0
                                        "
                                    >
                                        <el-image
                                            style=" width: 77px;height: 77px;margin-right: 50px; margin-bottom: 10px;"
                                            :src="img"
                                            alt=""
                                            v-for="(img,
                                            index) in item.imgUrlList"
                                            :key="index"
                                            :preview-src-list="item.imgUrlList"
                                        ></el-image>
                                    </div>
                                    <div class="img" v-else>—</div>
                                </div>
                            </div>
                        </div>
                    </div>
                </template>
                <div class="list" v-if="operationFlag && operationState == 2">
                    <h2>整改结果</h2>
                    <div class="item leftItem">
                        <div class="left img">
                            <span class="tip" style="color:red;">*</span>
                            <span>整改说明 ：</span>
                            <div class="inputbox">
                                <el-input
                                    maxlength="200"
                                    show-word-limit
                                    placeholder="请输入"
                                    type="textarea"
                                    v-model="opDesc"
                                ></el-input>
                            </div>
                        </div>
                    </div>
                    <div class="item" style="width:80%;">
                        <div class="right img">
                            <span style="white-space:nowrap;">现场图片 ：</span>
                            <el-upload
                                :class="{ hideAdd: imgFlag }"
                                ref="uploadImg"
                                :headers="headers"
                                :action="
                                    $axios.defaults.baseURL +
                                        '/ms/api/safety/check/uploadImg'
                                "
                                list-type="picture-card"
                                accept="image/png, image/jpg, image/jpeg"
                                :before-upload="beforeIMgUpload"
                                :on-success="logImgSuccess"
                                name="file"
                                :limit="10"
                                :on-exceed="exceedImg"
                                :on-remove="handleRemove"
                            >
                                <i slot="default" class="el-icon-plus"></i>
                            </el-upload>
                        </div>
                    </div>
                </div>

                <div
                    class="list"
                    v-if="reviewPeopleFlag && operationState == 3"
                >
                    <h2>复查结果</h2>
                    <div class="item" style="justify-content:flex-start">
                        <span class="tip" style="color:red;">*</span>
                        <span>是否合格 ：</span>
                        <RadioGroup v-model="operationRadio">
                            <Radio label="合格"></Radio>
                            <Radio label="不合格"></Radio>
                        </RadioGroup>
                    </div>
                    <div class="item leftItem">
                        <div class="left img">
                            <span class="tip" style="color:red;">*</span>
                            <span>复查说明 ：</span>
                            <div class="inputbox">
                                <el-input
                                    maxlength="200"
                                    show-word-limit
                                    placeholder="请输入"
                                    type="textarea"
                                    v-model="opDesc"
                                ></el-input>
                            </div>
                        </div>
                    </div>
                    <div class="item" style="width:80%;">
                        <div class="right img">
                            <span style="white-space:nowrap;">现场图片 ：</span>
                            <el-upload
                                :class="{ hideAdd: imgFlag }"
                                ref="uploadImg"
                                :headers="headers"
                                :action="
                                    $axios.defaults.baseURL +
                                        '/ms/api/safety/check/uploadImg'
                                "
                                list-type="picture-card"
                                accept="image/png, image/jpg, image/jpeg"
                                :before-upload="beforeIMgUpload"
                                :on-success="logImgSuccess"
                                name="file"
                                :limit="10"
                                :on-exceed="exceedImg"
                                :on-remove="handleRemove"
                            >
                                <i slot="default" class="el-icon-plus"></i>
                            </el-upload>
                        </div>
                    </div>
                </div>
                <div class="list" v-if="checkPeopleFlag && operationState == 4">
                    <h2>核验结果</h2>
                    <div class="item" style="justify-content:flex-start">
                        <span class="tip" style="color:red;">*</span>
                        <span>是否合格 ：</span>
                        <RadioGroup v-model="operationRadio">
                            <Radio label="合格"></Radio>
                            <Radio label="不合格"></Radio>
                        </RadioGroup>
                    </div>
                    <div class="item leftItem">
                        <div class="left img">
                            <span class="tip" style="color:red;">*</span>
                            <span>核验说明 ：</span>
                            <div class="inputbox">
                                <el-input
                                    maxlength="200"
                                    show-word-limit
                                    placeholder="请输入"
                                    type="textarea"
                                    v-model="opDesc"
                                ></el-input>
                            </div>
                        </div>
                    </div>
                    <div class="item" style="width:80%;">
                        <div class="right img">
                            <span style="white-space:nowrap;">现场图片 ：</span>
                            <el-upload
                                :class="{ hideAdd: imgFlag }"
                                ref="uploadImg"
                                :headers="headers"
                                :action="
                                    $axios.defaults.baseURL +
                                        '/ms/api/safety/check/uploadImg'
                                "
                                list-type="picture-card"
                                accept="image/png, image/jpg, image/jpeg"
                                :before-upload="beforeIMgUpload"
                                :on-success="logImgSuccess"
                                name="file"
                                :limit="10"
                                :on-exceed="exceedImg"
                                :on-remove="handleRemove"
                            >
                                <i slot="default" class="el-icon-plus"></i>
                            </el-upload>
                        </div>
                    </div>
                </div>
            </div>
            <div slot="footer">
                <el-button @click.native.prevent="cancel(4)" size="small" plain
                    >取消</el-button
                >
                <el-button
                    type="primary"
                    v-if="operationFlag || checkPeopleFlag || reviewPeopleFlag"
                    v-preventReClick="1500"
                    @click.native.prevent="problemLogBtn(2)"
                    size="small"
                    plain
                    >保存</el-button
                >
                <el-button
                    type="primary"
                    v-else
                    @click.native.prevent="problemLogBtn(1)"
                    size="small"
                    v-preventReClick="1500"
                    plain
                    >确定</el-button
                >
            </div>
        </Modal>

        <Modal
            v-model="gpsModal"
            title="选择项目位置"
            width="1000px"
            :mask-closable="false"
        >
            <div class="msg">
                <div
                    style="width:900px;height:500px;margin:20px auto;position: relative;"
                >
                    <div id="gps" class="gps"></div>
                    <div class="searchAddress">
                        <Input
                            search
                            enter-button
                            placeholder="请输入准确的检查地址"
                            style="width:300px"
                            @on-search="searchAddress"
                            v-model="address"
                            clearable
                        />
                    </div>
                </div>
            </div>
            <div slot="footer">
                <el-button @click.native.prevent="cancel(3)" size="small" plain
                    >取消</el-button
                >
                <el-button
                    type="primary"
                    @click.native.prevent="submitGPS"
                    size="small"
                    plain
                    >确定</el-button
                >
            </div>
        </Modal>
        
        <Modal
            v-model="exportModal"
            title="导出"
            width="500px;"
            :mask-closable="false"
            class-name="addModal"
            :footer-hide="true"
        >
            <div style="margin:20px auto;text-align: center;">
                <img
                    src="../../assets/images/common/succes-iocn.png"
                    style="width: 60px;height: 60px;display: block;margin: auto"
                    alt=""
                />
            </div>
            <div style="margin:20px auto;text-align: center;">
                导出任务已创建！
            </div>
            <div
                style="margin:20px auto;text-align: center;display: flex;justify-content: center;align-items: center;"
            >
                <p>系统正在处理，请稍后到</p>
                <router-link to="/exp/list">导出记录</router-link>
                <p>下载。</p>
            </div>
        </Modal>
    </div>
</template>
<script>
import Treeselect from "@riophae/vue-treeselect";
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
import { toTree, transId, trans, setIssueTree } from "@/sever/config.js";
import { getAlldeptList, getProectDetails } from "@/api/api.js";
import { initYMD } from "@/sever/utils.js";
import {
    getSafetyRecordList,
    getQualityRecordPageList,
    problemReportAdd,
    getUserList,
    getQualityPartList,
    safetyProblemReportDetails,
    safetyProblemReportLog,
    getIssueTypeList,
    problemIssueList,
    getIssueList,
    issueDeptIdList,
    getSafetyCheckExport,
    getIssueCheckDel
} from "@/api/safety.js";
export default {
    data() {
        return {
            headers: {
                Authorization:localStorage.getItem('COOKIE'),
            },
            disabled: false,
            resTransArr: [],
            switchClassName: "选择录入",
            switchCheckName: "选择录入",
            closeOnSelect: false,
            operationRadio: "合格",
            operationFlag: false,
            reviewPeopleFlag: false,
            checkPeopleFlag: false,
            operationState: "",
            siteImgUrl: [],
            opDesc: "",
            allNum: "",
            reportNum: "",
            disposeNum: "",
            pageNum: 1,
            pageSize: 10,
            totalCount: "",
            current: 1,
            tableList: [],
            mapFlag: false,
            tabActiveName: "first",
            gpsModal: false,
            inputShow: false,
            reportModal: false,
            detailsModal: false,
            dateArr: [],
            projectId: "",
            timeoutMode: "",
            aboutMe: "",
            urgency: "",
            issueStatus: "",
            datalist: [],
            check: null,
            checkID: "",
            issueTypeName: null,
            issueTypeId: "",
            submitData: {
                partId: "",
                partName: "",
                issueTypeId: "",
                issueTypeName: "",
                issueId: "",
                checkText: "",
                generalRadio: "一般",
                issueTree: null,
                issueContent: "",
                siteImgUrl: [],
                timeLimit: "",
                require: "",
                operator: "",
                reviewPeople: "",
                checkPeople: "",
                sendPeople: "",
                sendPeopleObj: [],
                checkPeopleObj: [],
                reviewPeopleObj: [],
                operatorObj: [],
                lat: "",
                lng: "",
                ads: "请选择检查地址"
            },
            sendPeopleObj: "",
            checkPeopleObj: "",
            reviewPeopleObj: "",
            operatorObj: "",
            detailsObj: {},
            operatorList: [],
            reviewPeopleList: [],
            sendPeopleList: [],
            checkPeopleList: [],
            timeoutModeList: [
                {
                    id: 0,
                    name: "正常整改"
                },
                {
                    id: 1,
                    name: "超时整改"
                }
            ],
            aboutMeList: [
                {
                    id: 1,
                    name: "我上报的"
                },
                {
                    id: 2,
                    name: "需要我处理的"
                }
            ],
            urgencyList: [
                {
                    id: 1,
                    name: "一般"
                },
                {
                    id: 2,
                    name: "紧急"
                }
            ],
            issueStatusList: [
                {
                    id: 10,
                    name: "待整改"
                },
                {
                    id: 20,
                    name: "待复查"
                },
                {
                    id: 30,
                    name: "待核验"
                },
                {
                    id: 999,
                    name: "不合格"
                },
                {
                    id: 100,
                    name: "合格"
                }
            ],
            options: {
                disabledDate(date) {
                    return date.getTime() < Date.now() - 8.64e7
                }
            },
            options1: {
                disabledDate(date) {
                    return date && date.valueOf() < Date.now() - 86400000;
                }
            },
            polygons: [],
            prjmap: "",
            partId: "",
            userList: [],
            issuelist: [],
            checkId: "",
            lat: "",
            lng: "",
            imgFlag: false,
            marker: null,
            address: "",
            adsLat: "",
            adsLng: "",
            qualityIds: [],
            exportModal: false,
            auth: {
                isReport: false,
                isDelete: false
            },
            btnList: [], //权限列表
            normalizer(node){
                //去掉children=null的属性
                if(node.children==null||node.children=='null'){
                    delete node.children;
                }
            },
        };
    },
    computed: {
        porjectObject() {
            return this.$store.state.porjectObject;
        }
    },
    watch: {
        porjectObject(val, oldVal) {
            if (val.deptId != oldVal.deptId) {
                this.projectId = val.deptId;
                this.dateArr = ["", ""];
                this.timeoutMode = "";
                this.aboutMe = "";
                this.urgency = "";
                this.issueStatus = "";
                this.check = null;
                this.tableList = [];
                this.mapFlag = false;
                this.tabActiveName = "";
                this.gpsModal = false;
                this.pageNum = 1;
                this.current = 1;
                this.lat = val.lat == undefined ? 30.592335 : val.lat;
                this.lng = val.lng == undefined ? 114.29484 : val.lng;
                this.initDate();
                this.getChecktPartList();
                this.issueDeptIdListAll();
                this.getUser();
            }
        },
        siteImgUrl(val, oldVal) {
            if (val.length == 10) {
                this.imgFlag = true;
            } else {
                this.imgFlag = false;
            }
        },
        "submitData.siteImgUrl": {
            handler(val, oldVal) {
                //do something
                if (val.length == 10) {
                    this.imgFlag = true;
                } else {
                    this.imgFlag = false;
                }
            },
            deep: true
        },
        detailsModal(val, oldval) {
            if (!val) {
                this.qualityIds = [];
            }
        }
    },
    components: { Treeselect },
    created() {},
    beforeDestroy() {
        if (localStorage.getItem("logTime")) {
            localStorage.removeItem("logTime");
        }
    },
    mounted() {
        this.projectId = this.$store.state.porjectObject.deptId;
        this.lat =
            this.$store.state.porjectObject.lat == undefined
                ? 30.592335
                : this.$store.state.porjectObject.lat;
        this.lng =
            this.$store.state.porjectObject.lng == undefined
                ? 114.29484
                : this.$store.state.porjectObject.lng;
        if (localStorage.getItem("logTime")) {
            this.dateArr = [
                initYMD(JSON.parse(localStorage.getItem("logTime"))),
                initYMD(JSON.parse(localStorage.getItem("logTime")))
            ];
            this.getPageList();
        } else {
            this.initDate();
        }
        this.getChecktPartList();
        this.issueDeptIdListAll();
        this.btnList = JSON.parse(localStorage.getItem("arr")); //localStorage当中的arr项存取的是按钮权限列表
        this.initAuth(); //初始化权限
        setTimeout(() => {
            this.inputShow = true;
        }, 1);
    },
    methods: {
        remove(item) {
            getIssueCheckDel(item.checkId)
                .then(res => {
                    if (res.code == 200) {
                        this.$Message.success("操作成功");
                        this.getPageList();
                    } else {
                        this.$Message.warning(res.msg);
                    }
                })
                .catch(error => {
                    console.log(error);
                });
        },

        initAuth() {
            this.auth.isReport = this.btnList.includes(
                "safety/record/problemReport"
            );
            this.auth.isDelete = this.btnList.includes("safety/record/del");
        },
        getAds() {
            var _that = this;
            let params = {
                id: this.projectId
            };
            getProectDetails(params)
                .then(res => {
                    if (res.code == 200) {
                        this.lat = res.data.lat || 30.592335;
                        this.lng = res.data.lng || 114.29484;
                        this.adsLat = this.lat;
                        this.adsLng = this.lng;
                        this.submitData.lat = this.lat;
                        this.submitData.lng = this.lng;
                        AMap.service("AMap.Geocoder", function() {
                            //回调函数
                            //实例化Geocoder
                            var geocoder = new AMap.Geocoder({
                                city: "" //城市，默认:“全国”
                            });
                            // return;
                            var lnglatXY = [res.data.lng, res.data.lat]; //地图上所标点的坐标
                            geocoder.getAddress(lnglatXY, function(
                                status,
                                result
                            ) {
                                if (
                                    status === "complete" &&
                                    result.info === "OK"
                                ) {
                                    //获得了有效的地址信息:
                                    //即，result.regeocode.formattedAddress
                                    var city =
                                        result.regeocode.formattedAddress;
                                } else {
                                    var city = "暂无位置信息";
                                    //获取地址失败
                                }
                                _that.submitData.ads = city;
                            });
                        });
                    }
                })
                .catch(error => {
                    console.log(error);
                });
        },
        goEXP() {
            this.$router.push({ path: "/exp/list" });
        },
        handleClick() {
            if (this.qualityIds.length == 0) {
                this.$Modal.warning({
                    title: "提示",
                    content: "请勾选需要导出的数据"
                });
                return;
            }
            let str = "";
            for (var i = 0; i < this.qualityIds.length; i++) {
                str += this.qualityIds[i] + ",";
            }
            //去掉最后一个逗号(如果不需要去掉，就不用写)
            if (str.length > 0) {
                str = str.substr(0, str.length - 1);
            }
            let params = {
                safetyIds: str,
                deptId: this.projectId
            };
            getSafetyCheckExport(params)
                .then(res => {
                    if (res.code == 200) {
                        this.exportModal = true;
                        this.getPageList();
                    } else {
                        this.$Message.warning(res.msg);
                    }
                })
                .catch(error => {
                    console.log(error);
                });
        },
        handleSelectionChange(val) {
            this.qualityIds = [];
            val.forEach(i => {
                this.qualityIds.push(i.checkId);
            });
        },
        switchCheckNameFn() {
            this.submitData.partId = "";
            this.submitData.partName = "";
            this.submitData.checkTree = null;
        },
        switchClassNameFn() {
            this.submitData.issueTypeId = "";
            this.submitData.issueTypeName = "";
            this.submitData.isssueId = "";
            this.submitData.issueTree = null;
            this.submitData.issueContent = "";
        },
        exceedImg(files, fileList) {
            if (this.siteImgUrl.length == 10) {
                this.$Message.warning("上传图片最多10张");
                return;
            }
            if (this.submitData.siteImgUrl.length == 10) {
                this.$Message.warning("上传图片最多10张");
                return;
            }
        },
        handleReportRemove(res, fileList) {
            this.submitData.siteImgUrl = [];
            fileList.forEach(v => {
                this.submitData.siteImgUrl.push(v.response.data);
            });
        },
        reportlogImgSuccess(res) {
            this.submitData.siteImgUrl.push(res.data);
        },
        logImgSuccess(res, file) {
            this.siteImgUrl.push(res.data);
        },
        handleRemove(file, fileList) {
            this.siteImgUrl = [];
            fileList.forEach(v => {
                this.siteImgUrl.push(v.response.data);
            });
        },
        problemLogBtn(type) {
            if (type == 1) {
                this.detailsModal = false;
                return;
            } else {
                let operationRadio = this.operationRadio;
                if (operationRadio == "合格") {
                    operationRadio = 1;
                } else {
                    operationRadio = 2;
                }
                if (this.opDesc == "") {
                    if (this.operationState == 2) {
                        this.$Modal.warning({
                            title: "您有必填字段",
                            content: "请填写整改说明"
                        });
                        return;
                    } else if (this.operationState == 3) {
                        this.$Modal.warning({
                            title: "您有必填字段",
                            content: "请填写复查说明"
                        });
                        return;
                    } else if (this.operationState == 4) {
                        this.$Modal.warning({
                            title: "您有必填字段",
                            content: "请填写核验说明"
                        });
                        return;
                    }
                }
                let parmas = {
                    checkId: this.checkId,
                    opType: this.operationState,
                    opDesc: this.opDesc,
                    opResult: operationRadio,
                    imgUrls: this.siteImgUrl
                };
                safetyProblemReportLog(parmas)
                    .then(res => {
                        if (res.code == 200) {
                            this.checkId = "";
                            this.operationState = "";
                            this.opResult = "";
                            this.opDesc = "";
                            this.siteImgUrl = [];
                            this.operationRadio = "合格";
                            this.detailsModal = false;
                            this.$Message.success("操作成功");
                            this.getPageList();
                        } else {
                            this.$Message.warning(res.msg);
                        }
                    })
                    .catch(err => {
                        console.log(err);
                    });
            }
        },
        submitBtn() {
            if (this.submitData.ads == "" || !this.submitData.ads) {
                this.$Modal.warning({
                    title: "您有必填字段",
                    content: "请选择检查地址"
                });
                return;
            }
            if (
                this.submitData.lng == "" ||
                this.submitData.lat == "" ||
                !this.submitData.lng ||
                !this.submitData.lat
            ) {
                this.$Modal.warning({
                    title: "您有必填字段",
                    content: "未获取到经纬度"
                });
                return;
            }
            if (
                this.submitData.issueContent == "" ||
                !this.submitData.issueContent
            ) {
                this.$Modal.warning({
                    title: "您有必填字段",
                    content: "请填写问题明细"
                });
                return;
            }
            if (this.submitData.partName == "" || !this.submitData.partName) {
                this.$Modal.warning({
                    title: "您有必填字段",
                    content: "请填写检查部位"
                });
                return;
            }
            if (this.submitData.checkText == "" || !this.submitData.checkText) {
                this.$Modal.warning({
                    title: "您有必填字段",
                    content: "请填写检查说明"
                });
                return;
            }
            if (
                this.submitData.generalRadio == "" ||
                !this.submitData.generalRadio
            ) {
                this.$Modal.warning({
                    title: "您有必填字段",
                    content: "请选择紧急程度"
                });
                return;
            }

            if (this.submitData.operatorObj.length <= 0) {
                this.$Modal.warning({
                    title: "您有必填字段",
                    content: "请选择整改人"
                });
                return;
            }
            if (this.submitData.timeLimit == "" || !this.submitData.timeLimit) {
                this.$Modal.warning({
                    title: "您有必填字段",
                    content: "请选择整改期限"
                });
                return;
            }
            if (this.submitData.require == "" || !this.submitData.require) {
                this.$Modal.warning({
                    title: "您有必填字段",
                    content: "请填写整改要求"
                });
                return;
            }
            if (this.submitData.reviewPeopleObj.length <= 0) {
                this.$Modal.warning({
                    title: "您有必填字段",
                    content: "请选择复查人"
                });
                return;
            }
            if (this.submitData.generalRadio == "紧急") {
                this.submitData.generalRadio = 2;
            } else {
                this.submitData.generalRadio = 1;
            }
            let timeLimit = new Date(this.submitData.timeLimit);
            this.submitData.timeLimit =
                timeLimit.getFullYear() +
                "-" +
                (timeLimit.getMonth() + 1) +
                "-" +
                timeLimit.getDate();
            let checkUsers;
            if (this.submitData.checkPeopleObj.length > 0) {
                checkUsers = [
                    ...this.submitData.operatorObj,
                    ...this.submitData.reviewPeopleObj,
                    ...this.submitData.checkPeopleObj,
                    ...this.submitData.sendPeopleObj
                ];
            } else {
                checkUsers = [
                    ...this.submitData.operatorObj,
                    ...this.submitData.reviewPeopleObj,
                    ...this.submitData.sendPeopleObj
                ];
            }
            let parmas = {
                deptId: this.projectId,
                partId: this.submitData.partId,
                partName: this.submitData.partName,
                issueTypeId: this.submitData.issueTypeId,
                issueTypeName: this.submitData.issueTypeName,
                issueId: this.submitData.isssueId,
                issueContent: this.submitData.issueContent,
                rectifyRequire: this.submitData.require,
                rectifyDuration: this.submitData.timeLimit,
                urgency: this.submitData.generalRadio,
                checkDesc: this.submitData.checkText,
                address: this.submitData.ads,
                lng: this.submitData.lng,
                lat: this.submitData.lat,
                imgUrls: this.submitData.siteImgUrl,
                checkUsers: checkUsers
            };
            problemReportAdd(parmas)
                .then(res => {
                    if (res.code == 200) {
                        this.$Message.success(res.msg);
                        this.reportModal = false;
                        this.submitData = {};
                        this.submitData.siteImgUrl = [];
                        this.submitData.sendPeopleObj = [];
                        this.submitData.checkPeopleObj = [];
                        this.submitData.reviewPeopleObj = [];
                        this.submitData.operatorObj = [];
                        this.getPageList();
                    } else {
                        this.$Message.warning(res.msg);
                    }
                })
                .catch(err => {});
        },
        switchListBtn() {
            this.mapFlag = !this.mapFlag;
            this.getPageList();
        },
        setTabClick(name) {
            this.pageNum = 1;
            this.current = 1;
            if (this.tabActiveName == "first") {
                this.aboutMe = "";
            } else if (this.tabActiveName == "second") {
                this.aboutMe = 1;
            } else if (this.tabActiveName == "third") {
                this.aboutMe = "2,3,4";
            }
            this.getPageList();
        },
        getDateArr(i, v) {
            this.dateArr = i;
        },
        getTimeoutMode(index) {
            this.timeoutMode = index;
        },
        getAboutMe(index) {
            this.aboutMe = index;
        },
        getUrgency(index) {
            this.urgency = index;
        },
        getIssueStatus(index) {
            this.issueStatus = index;
        },
        beforeIMgUpload(file) {
            let acceptFileType = ['jpg','png','jpeg']
            let type = file.name.split(".").slice(-1)[0].toLowerCase()
            const isLt2M = file.size / 1024 / 1024 < 2;
            if(!acceptFileType.includes(type)){
                this.$Message.error("请上传png，jpg，jpeg格式的文件！")
                return false
            }
            if (!isLt2M) {
                this.$Message.error("上传图片大小不能超过 2MB!");
            }
            return isLt2M;
        },
        // 整改人
        getOperator(index) {
            this.submitData.operator = index;
            let arr = [];
            index.forEach(i => {
                this.operatorList.forEach(v => {
                    if (i == v.id) {
                        let obj = {
                            type: 2,
                            userName: v.nickname,
                            userPhone: v.phone,
                            userId: v.id
                        };
                        arr.push(obj);
                    }
                });
            });
            this.submitData.operatorObj = arr;
        },
        //复查人
        getReviewPeople(index) {
            this.submitData.reviewPeople = index;
            let arr = [];
            index.forEach(i => {
                this.reviewPeopleList.forEach(v => {
                    if (i == v.id) {
                        let obj = {
                            type: 3,
                            userName: v.nickname,
                            userPhone: v.phone,
                            userId: v.id
                        };
                        arr.push(obj);
                    }
                });
            });
            this.submitData.reviewPeopleObj = arr;
        },
        //核验人
        getCheckPeople(index) {
            this.submitData.checkPeople = index;
            let arr = [];
            index.forEach(i => {
                this.checkPeopleList.forEach(v => {
                    if (i == v.id) {
                        let obj = {
                            type: 4,
                            userName: v.nickname,
                            userPhone: v.phone,
                            userId: v.id
                        };
                        arr.push(obj);
                    }
                });
            });
            this.submitData.checkPeopleObj = arr;
        },
        getSendPeople(index) {
            this.submitData.sendPeople = index;
            let arr = [];
            index.forEach(i => {
                this.sendPeopleList.forEach(v => {
                    if (i == v.id) {
                        let obj = {
                            type: 5,
                            userName: v.nickname,
                            userPhone: v.phone,
                            userId: v.id
                        };
                        arr.push(obj);
                    }
                });
            });
            this.submitData.sendPeopleObj = arr;
        },
        cancel(type) {
            if (type == 3) {
                this.gpsModal = false;
                this.adsLat = "";
                this.adsLng = "";
                this.submitData.ads = "请选择检查地址";
                this.submitData.lat = "";
                this.submitData.lng = "";
            } else if (type == 2) {
                this.reportModal = false;
                (this.submitData = {}), (this.submitData.siteImgUrl = []);
                this.siteImgUrl = [];
            } else if (type == 4) {
                this.detailsModal = false;
                this.sendPeopleObj = "";
                this.opDesc = "";
                this.operationRadio = "合格";
            }
        },
        showModalBtn() {
            this.getAds();
            this.reportModal = true;
            // this.submitData.ads="请选择检查地址";
            this.submitData.generalRadio = "一般";
            (this.switchClassName = "选择录入"),
                (this.switchCheckName = "选择录入"),
                (this.submitData.siteImgUrl = []);
            this.siteImgUrl = [];
            this.getUser();
        },
        visibleChangeFn(e) {
            if (!e) {
                this.$refs.uploadImg.clearFiles();
            }
        },
        clear() {
            this.timeoutMode = "";
            this.aboutMe = "";
            this.urgency = "";
            this.issueStatus = "";
            this.check = null;
            this.checkID = "";
            this.initDate();
        },
        searchAll() {
            this.pageNum = 1;
            this.current = 1;
            this.getPageList();
        },
        getMap(dataArr) {
            let _that = this;
            let map = new AMap.Map("container", {
                zoom: 12,
                center: [this.lng, this.lat],
                resizeEnable: true
            });
            map.clearMap(); // 清除地图覆盖物

            let markers = [];
            dataArr.forEach(v => {
                if (v.state == 10) {
                    v.name = "待整改";
                    v.color = "#FF4848";
                } else if (v.state == 20) {
                    v.name = "待复查";
                    v.color = "#FFA64D";
                } else if (v.state == 30) {
                    v.name = "待核验";
                    v.color = "#3755A7";
                } else if (v.state == 100) {
                    v.name = "合格";
                    v.color = "#3FCF77";
                } else if (v.state == 12 || v.state == 11) {
                    v.name = "不合格";
                    v.color = "#A9B0BB";
                }
                if (v.urgency == 1) {
                    let obj = {
                        id: v.checkId,
                        state: v.state,
                        name: v.name,
                        color: v.color,
                        icon: require("../../assets/images/safety/record/qualified.svg"),
                        position: [v.lng, v.lat]
                    };
                    markers.push(obj);
                } else if (v.urgency == 2) {
                    let obj = {
                        id: v.checkId,
                        state: v.state,
                        name: v.name,
                        color: v.color,
                        icon: require("../../assets/images/safety/record/warning.svg"),
                        position: [v.lng, v.lat]
                    };
                    markers.push(obj);
                }
            });
            // 添加一些分布不均的点到地图上,地图上添加三个点标记，作为参照
            markers.forEach(item => {
                let marker = new AMap.Marker({
                    map: map,
                    icon: item.icon,
                    position: [item.position[0], item.position[1]],
                    offset: new AMap.Pixel(-13, -20)
                });
                marker.setLabel({
                    state: item.state,
                    id: item.id,
                    offset: new AMap.Pixel(0,0), //设置文本标注偏移量
                    content:
                        `<div class='in_fo1 in_fo0' style='background:${item.color}; box-shadow: 0px 0px 5px 2px rgba(0,0,0,0.1);'>` +
                        item.name +
                        "</div>", //设置文本标注内容
                    direction: "top" //设置文本标注方位
                });
                AMap.event.addListener(marker, "click", machMAp);
            });

            let center = map.getCenter();
            //鼠标点击事件,设置地图中心点及放大显示级别
            function machMAp(e) {
                let checkId = e.target.De.label.id
                map.setZoomAndCenter(15, e.target.getPosition());
                _that.infoWindow = new AMap.InfoWindow({
                    offset: new AMap.Pixel(0, -30)
                });
                _that.toDetail(checkId);
            }
            let newCenter = map.setFitView();
        },
        toDetail(id) {
            this.$router.push({
                path: "/safety/problemDetail",
                query: {
                    checkId: id,
                    problemType: "safety"
                }
            })
        },
        //获取问题明細
        issueDeptIdListAll() {
            let params = {
                deptId: this.projectId
            };
            getIssueTypeList(params)
                .then(res => {
                    if (res.code == 200) {
                        let list = res.data.list;
                        this.issuelist = setIssueTree(list);
                    } else {
                        this.$Message.warning(res.msg);
                    }
                })
                .catch(error => {
                    console.log(error);
                });
        },
        //获取带分页的检查记录列表
        getPageList() {
            let d1 = new Date(this.dateArr[0]);
            let d2 = new Date(this.dateArr[1]);
            this.dateArr[0] =
                d1.getFullYear() +
                "-" +
                (d1.getMonth() + 1) +
                "-" +
                d1.getDate();
            this.dateArr[1] =
                d2.getFullYear() +
                "-" +
                (d2.getMonth() + 1) +
                "-" +
                d2.getDate();
            let issueStatus = this.issueStatus;
            if (issueStatus == 999) {
                issueStatus = "11,12";
            }
            let parmas = {
                deptId: this.projectId,
                type: this.aboutMe,
                state: issueStatus,
                startTime: this.dateArr[0],
                endTime: this.dateArr[1],
                partId: this.checkID,
                urgency: this.urgency,
                overdue: this.timeoutMode,
                pageNum: !this.mapFlag ? this.pageNum : "",
                pageSize: !this.mapFlag ? this.pageSize : ""
            };
            getSafetyRecordList(parmas)
                .then(res => {
                    if (res.code == 200) {
                        let allNum = res.data.allNum;
                        let reportNum = res.data.reportNum;
                        let disposeNum = res.data.disposeNum;
                        this.allNum = allNum ? allNum : 0;
                        this.reportNum = reportNum ? reportNum : 0;
                        this.disposeNum = disposeNum ? disposeNum : 0;
                        this.totalCount = res.data.total;
                        this.tableList = res.data.checkList;
                        if (this.mapFlag) {
                            this.getMap(res.data.checkList);
                        }
                    } else {
                        this.$Message.warning(res.msg);
                    }
                })
                .catch(err => {});
        },
        initDate() {
            let myDate = new Date();
            let year = myDate.getFullYear();
            let month = myDate.getMonth() + 1; //获取当前月份(0-11,0代表1月，所以要加1);
            let day = myDate.getDate(); //获取当前日（1-31）
            if (month < 10) {
                month = "0" + month;
            }
            if (day >= 0 && day <= 9) {
                if (day == 1) {
                    month = myDate.getMonth();
                    if (month == 0) {
                        month = 12;
                        year = year - 1;
                    }
                    day = new Date(year, month, 0).getDate();
                } else {
                    // day = day < 10 ? "0" + (day-1) : (day-1);当日的前一天
                    // day = day < 10 ? "0" + day : day 当日
                }
            }
            let startDate = year + "-" + month + "-" + "01";
            let endDate = year + "-" + month + "-" + day;
            this.dateArr = [startDate, endDate];
            this.getPageList();
        },
        //获取检查部位
        getChecktPartList() {
            let params = {
                deptId: this.projectId
            };
            getQualityPartList(params)
                .then(res => {
                    if (res.code == 200) {
                        let data = res.data.list;
                        this.datalist = transId(data);
                        if (this.datalist.length == 0) {
                            this.datalist.push({
                                id: "all",
                                title: "暂无数据",
                                label: "暂无数据",
                                isDisabled: true
                            });
                        }
                    } else {
                        this.$Message.warning(res.msg);
                    }
                })
                .catch(error => {
                    console.log(error);
                });
        },
        getCheckSelect(index) {
            this.check = index.name;
            this.checkID = index.id;
        },
        getReportCheckSelect(index) {
            let partName = index.name;
            if (index.pid != 0) {
                let resArr = this.treeFindPath(
                    this.datalist,
                    data => data.partId === index.pid
                );
                partName = resArr.join("/") + partName;
            }
            this.submitData.partId = index.id;
            this.submitData.partName = partName;
        },
        getIssueClassSelect(item) {
            if (item.issueId) {
                this.submitData.isssueId = item.issueId;
                this.submitData.issueTypeId = item.issueTypeId;
                this.submitData.issueTypeName = item.issueTypeName;
                this.submitData.issueContent = item.content;
                this.submitData.require = item.require;
                let newDate = new Date().getTime();
                let date = item.duration * 86400000;
                let resDate = newDate + date;
                // let year = resDate.getFullYear();
                // let month = resDate.getMonth() + 1; //获取当前月份(0-11,0代表1月，所以要加1);
                // let day = resDate.getDate(); //获取当前日（1-31）
                // month= month<10?'0'+month:month
                // day= day<10?'0'+day:day
                this.submitData.timeLimit = new Date(parseInt(resDate))
                    .toLocaleString()
                    .replace(/年|月/g, "-")
                    .replace(/日/g, " ");
            } else {
                this.submitData.isssueId = item.issueTypeId;
                this.submitData.issueTypeId = item.issueTypeId;
                this.submitData.issueTypeName = item.label;
                this.submitData.issueContent = item.label;
            }
        },
        getIssueClassInput(index) {
            this.submitData.issueTree = index;
            let obj = {
                lable: index,
                id: ""
            };
            this.issuelist.push(obj);
            this.closeOnSelect = false;
        },
        getGPS() {
            var _that = this;
            _that.gpsModal = true;
            _that.address = "";
            _that.submitData.lat = _that.submitData.lat || 30.592335;
            _that.submitData.lng = _that.submitData.lng || 114.29484;
            _that.prjmap = new AMap.Map("gps", {
                zoom: 14,
                center: [_that.submitData.lng, _that.submitData.lat]
            });
            var marker;
            AMap.event.addListener(_that.prjmap, "click", function(e) {
                if (_that.marker != null) {
                    _that.prjmap.remove(_that.marker);
                }
                _that.marker = new AMap.Marker({
                    icon:
                        "https://webapi.amap.com/theme/v1.3/markers/n/mark_bs.png",
                    position: [e.lnglat.lng, e.lnglat.lat],
                    offset: new AMap.Pixel(-20, -40)
                });
                _that.address = "";
                _that.marker.setMap(_that.prjmap);
                _that.submitData.lng = e.lnglat.lng;
                _that.submitData.lat = e.lnglat.lat;
                _that.adsLng = e.lnglat.lng;
                _that.adsLat = e.lnglat.lat;
                AMap.service("AMap.Geocoder", function() {
                    //回调函数
                    //实例化Geocoder
                    var geocoder = new AMap.Geocoder({
                        city: "" //城市，默认:“全国”
                    });
                    var lnglatXY = [e.lnglat.getLng(), e.lnglat.getLat()]; //地图上所标点的坐标
                    geocoder.getAddress(lnglatXY, function(status, result) {
                        if (status === "complete" && result.info === "OK") {
                            //获得了有效的地址信息:
                            //即，result.regeocode.formattedAddress
                            var city = result.regeocode.formattedAddress;
                        } else {
                            var city = "暂无位置信息";
                            //获取地址失败
                        }
                        _that.submitData.ads = city;
                    });
                });
            });
            if (_that.adsLng != "") {
                _that.marker = new AMap.Marker({
                    icon:
                        "https://webapi.amap.com/theme/v1.3/markers/n/mark_bs.png",
                    position: [_that.adsLng, _that.adsLat],
                    offset: new AMap.Pixel(-20, -40)
                });
                _that.marker.setMap(_that.prjmap);
            } else {
                _that.marker = new AMap.Marker({});
            }
        },
        searchAddress() {
            if (this.address == "") {
                this.$Modal.warning({
                    title: "您有必填字段",
                    content: "请输入地址"
                });
                return;
            }
            var _that = this;
            if (_that.marker != null) {
                _that.prjmap.remove(_that.marker);
            }

            _that.marker = new AMap.Marker();
            AMap.service("AMap.Geocoder", function() {
                var geocoder = new AMap.Geocoder({
                    city: "" //城市设为北京，默认：“全国”
                });
                geocoder.getLocation(_that.address, function(status, result) {
                    if (status === "complete" && result.geocodes.length) {
                        var lnglat = result.geocodes[0].location;
                        _that.submitData.lng = lnglat.lng;
                        _that.submitData.lat = lnglat.lat;
                        _that.adsLng = lnglat.lng;
                        _that.adsLat = lnglat.lat;
                        _that.submitData.ads = _that.address;
                        _that.marker.setPosition(lnglat);
                        _that.prjmap.add(_that.marker);
                        _that.prjmap.setFitView(_that.marker);
                        _that.address = "";
                    } else {
                        _that.$Message.warning("根据地址查询位置失败");
                        // log.error('根据地址查询位置失败');
                    }
                });
            });
        },
        submitGPS() {
            this.gpsModal = false;
        },
        pageChange(index) {
            this.pageNum = index;
            this.getPageList();
        },
        pageSizeChange(index) {
            this.pageSize = index;
            this.getPageList();
        },
        getUser() {
            let params = {
                deptId: this.projectId
            };
            getUserList(params)
                .then(res => {
                    if (res.code == 200) {
                        this.operatorList = res.data;
                        this.reviewPeopleList = res.data;
                        this.sendPeopleList = res.data;
                        this.checkPeopleList = res.data;
                    } else {
                        this.$Message.warning(res.msg);
                    }
                })
                .catch(err => {});
        },
        treeFindPath(tree, func, path = []) {
            if (!tree) return [];
            for (const data of tree) {
                // 这里按照你的需求来存放最后返回的内容吧
                path.push(data.name);
                if (func(data)) return path;
                if (data.children) {
                    const findChildren = this.treeFindPath(
                        data.children,
                        func,
                        path
                    );
                    if (findChildren.length) return findChildren;
                }
                path.pop();
            }
            return [];
        },
        getReportDate(index) {
            this.submitData.timeLimit = index;
        }
    }
};
</script>

<style scoped lang="less">
@import "./../../assets/style/themeBase.less";
@import "../../assets/style/qualityAndSafety/record.less";
.map{
    height: 100%;
}
.searchAddress {
    width: 300px;
    position: absolute;
    top: 5px;
    left: 300px;
    display: flex;
    justify-content: space-between;
}
/deep/.el-button:focus, /deep/.el-button:hover {
    color: var(--themeColor);
    border-color: var(--themeColor1);
    background-color: var(--themeColor2);
}
</style>
